import TreeGridBase from '@/components/TreeGrid/TreeGridBase'

import { fetchTreeGridData, delColumn } from '@/api/ColumnApi'
import ColumnEdit from './ColumnEdit.vue'
import ColumnView from './ColumnView.vue'
import Columns from './ColumnColumns'

export default {
  extends: TreeGridBase, // 分页列表组件
  name: 'columnList',
  components: {
    ColumnEdit,
    ColumnView
  },
  data() {
    return {
      rowKey: 'id', // 主键
      columns: [this.getOpColumsCustom(),...Columns],
      viewFormId: "viewForm", // 查看页面ID
      editFormId: "editForm", // 编辑页面ID
      domainName: '栏目', // 域名称,例如用户列表，域名称为用户
    }
  },
  methods: {
    getDataList(params) { // 列表查询
      return fetchTreeGridData(params);
    },
    deleteByKey(params) { // 删除函数
      return delColumn(params);
    },
    getOpColumsCustom(){ // 列表操作按钮
      return {
        label: '操作',
        prop: 'title',
        width: 100,
        renderBody:   (h, row) =>
        <div style="padding:0px;margin:0px;" align="center">
          <el-button type="primary" icon="el-icon-share" size="mini"
                    onClick={() => this.toEdit(row)}>编辑</el-button>
        </div>
      }
    },
  }
}
